<script setup>
import { ref } from 'vue';
import { useLogStore } from "@/stores/logStore.js";

const logStore = useLogStore();
const dialogVisible = ref(false);
const formRef = ref(null);

// 显示对话框
const show = () => {
  dialogVisible.value = true;
};

// 关闭对话框
const close = () => {
  dialogVisible.value = false;
};

// 提交归档
const submitArchive = () => {
  formRef.value?.validate((valid) => {
    if (valid) {
      logStore.archiveLogs().then(() => {
        close();
      });
    }
  });
};

// 暴露show方法
defineExpose({ show });
</script>

<template>
  <el-dialog
      v-model="dialogVisible"
      title="日志归档"
      width="40%"
      @close="close"
  >
    <el-form
        ref="formRef"
        :model="logStore.archiveParams"
        label-width="120px"
        label-position="right"
    >
      <el-form-item
          label="保留天数"
          prop="retainDays"
          :rules="[
          { required: true, message: '请输入保留天数', trigger: 'blur' },
          { type: 'number', min: 1, message: '保留天数必须大于0', trigger: 'blur' }
        ]"
      >
        <el-input-number
            v-model.number="logStore.archiveParams.retainDays"
            :min="1"
            :max="365"
            controls-position="right"
        />
        <span class="form-tip">将归档早于此天数的日志</span>
      </el-form-item>

      <el-form-item
          label="每批处理数量"
          prop="batchSize"
          :rules="[
          { required: true, message: '请输入每批处理数量', trigger: 'blur' },
          { type: 'number', min: 100, max: 5000, message: '每批处理数量应在100-5000之间', trigger: 'blur' }
        ]"
      >
        <el-input-number
            v-model.number="logStore.archiveParams.batchSize"
            :min="100"
            :max="5000"
            controls-position="right"
        />
      </el-form-item>
    </el-form>

    <template #footer>
      <el-button @click="close">取消</el-button>
      <el-button type="primary" @click="submitArchive">开始归档</el-button>
    </template>
  </el-dialog>
</template>

<style scoped>
.form-tip {
  margin-left: 10px;
  color: #909399;
  font-size: 12px;
}
</style>